<template>
  <ga-modal
    v-model:visible="visible"
    title-align="start"
    :width="560"
    @close="handleCancel(formRef)"
  >
    <template #title>创建</template>
    <ga-spin style="width: 100%" :loading="loading">
      <ga-form ref="formRef" :model="formData"> asdasdasdsa </ga-form>
    </ga-spin>
    <template #footer>
      <ga-button @click="visible = false">取消</ga-button>
      <ga-button type="primary" @click="handleOk">确定</ga-button>
    </template>
  </ga-modal>
</template>

<script setup>
import { ref, defineEmits, reactive } from "vue";
import { editLayer2Subnet, createLayer2Subnet } from "@/api/layer2subnet.ts";
import { Message } from "@garco-design/web-vue";
import { RULE } from "@/constant/validators";
import useLoading from "@/hooks/loading";

const { loading, setLoading } = useLoading(false);
const formRef = ref(null);
const formData = reactive({
  ip: "",
  description: "",
});

const visible = ref(false);
const curId = ref("");
const open = async (record) => {
  visible.value = true;
  // if (record && record?.id) {
  //   setLoading(true);
  //   curId.value = record.id;
  //   Object.keys(formData).forEach((item) => {
  //     formData[item] = record[item];
  //   });
  //   setLoading(false);
  // }
};
// 保存
const emits = defineEmits(["fetchData"]);
const handleOk = async () => {
  const res = await formRef.value?.validate();
  if (!res) {
    try {
      const { code } = await createLayer2Subnet(formData);
      if (code === 20000) Message.success("操作成功");
      emits("fetchData");
    } finally {
      visible.value = false;
    }
  }
};
const handleCancel = (formEl) => {
  formEl.resetFields();
};
defineExpose({ open });
</script>

<style lang="scss" scoped></style>
